<ui:composition xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:s="http://jboss.com/products/seam/taglib"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:a4j="http://richfaces.org/a4j"
	xmlns:rich="http://richfaces.org/rich">
	
	<rich:modalPanel id="vocableEditMD" autosized="true">
		<f:facet name="header">
			<h:outputText value="#{messages['vocable.edit.title']}" />
		</f:facet>
		<a4j:outputPanel>
			<s:fragment rendered="#{vocablesAction.editMode}">
				<a4j:form id="editForm">
					<rich:tabPanel switchType="client">
						<rich:tab label="#{messages['vocable.edit.data']}">
							<rich:messages globalOnly="true" />
							<h:panelGrid columns="2">
								<s:decorate template="/template/edit.xhtml">
									<ui:define name="label">#{selectedVocable.lessons.get(0).vocType.str1}</ui:define>
									<h:inputText id="str1" value="#{selectedVocable.str1}" required="true"/>
								</s:decorate>

								<s:decorate template="/template/edit.xhtml">
									<ui:define name="label">#{selectedVocable.lessons.get(0).vocType.str2}</ui:define>
									<h:inputText id="str2" value="#{selectedVocable.str2}" required="true"/>
								</s:decorate>

								<s:decorate template="/template/edit.xhtml">
									<ui:define name="label">#{selectedVocable.lessons.get(0).vocType.str3}</ui:define>
									<h:inputText id="str3" value="#{selectedVocable.str3}"/>
								</s:decorate>

								<s:decorate template="/template/edit.xhtml">
									<ui:define name="label">#{selectedVocable.lessons.get(0).vocType.str4}</ui:define>
									<h:inputText id="str4" value="#{selectedVocable.str4}" />
								</s:decorate>
							</h:panelGrid>
	
						</rich:tab>
					</rich:tabPanel>

					<div class="button_panel">
						<!-- BUTTON - SAVE -->
						<a4j:commandButton value="#{messages['modal.button.save']}"
							action="#{vocablesAction.saveOrUpdate()}"
							oncomplete="if (#{facesContext.maximumSeverity==null}) #{rich:component('vocableEditMD')}.hide();"
							reRender="editForm, vocableGridForm">
						</a4j:commandButton>

						<!-- BUTTON - CANCEL -->
						<a4j:commandButton value="#{messages['modal.button.cancel']}"
							action="#{vocablesAction.endEdit()}"
							onclick="Richfaces.hideModalPanel('vocableEditMD');"
							reRender="vocableGridForm" immediate="true">
						</a4j:commandButton>
					</div>
				</a4j:form>
			</s:fragment>

		</a4j:outputPanel>
	</rich:modalPanel>
</ui:composition>